{% extends '../../common/layouts/accLayout.tpl' %}
{% block content %}
	<div class="ui-ucenter-right ui-box ">
		<div>
			<div class="breadcrumb">
				<ul>
					<li>个人中心<i>&gt;</i></li>
					<li><span>个人资料</span></li>
				</ul>
			</div>
			<div class="ui-body bg-white myacc-userinfo-basis">
				<div class="info-list">
					<div class="info-list-item">
						<label>真实姓名：</label>
						<span id="name"></span>
					</div>
					<div class="info-list-item">
						<label>证件类型：</label>
						<span id="identity_type"></span>
					</div>
					<div class="info-list-item">
						<label>证件号码：</label>
						<span id="identity_no"></span>
					</div>
					<div class="info-list-item">
						<label>手机号码：</label>
						<span id="mobile"></span>
					</div>
				</div>
			</div>
			<div class="myacc-userinfo-repasswrod myacc-column myacc-column-fluid bg-white mt-20">
				<div class="myacc-column-title">
					登录密码修改
					<span class="fold f-r fold-show"></span>
				</div>
				<div class="myacc-column-content mt-40">
					<div class="form-body mt-10">
						<form class="layui-form" action="">
							<div class="layui-form-item">
								<label class="layui-form-label">原始密码</label>
								<div class="layui-input-block">
									<input type="password" name="password_old" lay-verify="login_old_pwd" id="login_old_pwd" autocomplete="off"
										   placeholder=" " class="layui-input">
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">新密码</label>
								<div class="layui-input-block">
									<input type="password" name="password_new" lay-verify="login_new_pwd" id="login_new_pwd" autocomplete="off"
										   placeholder=" " class="layui-input">
									<span class="form-tips">建议密码由8位以上数字、字母和特殊字符组成。</span>
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">确认新密码</label>
								<div class="layui-input-block">
									<input type="password"  lay-verify="login_new_pwd_re" id="login_new_pwd_re" autocomplete="off"
										   placeholder=" " class="layui-input">
								</div>
							</div>
							<div class="layui-form-item submit-item">
								<div class="layui-input-block">
									<button class="layui-btn btn-link-backgrund-orange btn-submit" lay-submit="" lay-filter="submitLoginPw">保  存</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
			<div class="myacc-userinfo-repasswrod-pay myacc-column myacc-column-fluid bg-white mt-20">
				<div class="myacc-column-title">
					交易密码修改
					<span class="fold f-r fold-hide"></span>
				</div>
				<div class="myacc-column-content mt-40">
					<div class="form-body mt-10">
						<form class="layui-form" action="">
							<div class="layui-form-item">
								<label class="layui-form-label">原始密码</label>
								<div class="layui-input-block">
									<input type="password" name="password_old" lay-verify="old_pwd" id="old_pwd" autocomplete="off"
										   placeholder=" " class="layui-input"><a href="javascript:void(0)" onclick="toFindOldPwd()" class="forget_pwd">忘记原始密码 >></a>
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">新密码</label>
								<div class="layui-input-block">
									<input type="password" name="password_new" lay-verify="new_pwd" id="new_pwd" autocomplete="off"
										   placeholder=" " class="layui-input">
									<span class="form-tips">密码由8位以上数字、字母和特殊字符组成。</span>
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">确认新密码</label>
								<div class="layui-input-block">
									<input type="password"  lay-verify="new_pwd_re" id="new_pwd_re" autocomplete="off"
										   placeholder=" " class="layui-input">
								</div>
							</div>
							<div class="layui-form-item submit-item">
								<div class="layui-input-block">
									<button class="layui-btn btn-link-backgrund-orange btn-submit" lay-submit lay-filter="submitPayPw">保  存</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="findOldPwd" style="display:none">
		<form class="layui-form" style="margin:10px"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
				<div class="layui-form-item">
					<div class="layui-input-block">
						<input type="text" name="mobile" id="find_mobile" lay-verify="mobile" autocomplete="off"
							   placeholder="手机号" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item" id="captcha-item" style="display: none;">
					<input type="text" name="captcha" lay-verify="captcha" placeholder="验证码" class="layui-input" >
					<img src="/common/captcha/get" onclick="this.src='/common/captcha/get?r='+Math.random();"/>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label"></label>
					<div class="layui-input-inline">
						<input type="text" name="verify_code" lay-verify="verify_code" autocomplete="off"
							   placeholder="短信验证码" class="layui-input">
					</div>
					<div class="f-r"><input class="but-border" onclick="sendSMS()" value="获取验证码"/></div>
				</div>
			<div class="layui-form-item submit-item">
				<div class="layui-input-block">
					<button class="layui-btn btn-link-backgrund-orange btn-submit" lay-submit lay-filter="next">下一步</button>
				</div>
			</div>
		</form>
	</div>
	<div id="findOldPwd_step2" style="display:none">
		<form class="layui-form" style="margin:10px"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
			<div class="layui-form-item">
				<div class="layui-input-block">
					<input type="text" name="mobile" id="find_mobile" lay-verify="mobile" autocomplete="off"
						   placeholder="手机号" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item" id="captcha-item" style="display: none;">
				<input type="text" name="captcha" lay-verify="captcha" placeholder="验证码" class="layui-input" >
				<img src="/common/captcha/get" onclick="this.src='/common/captcha/get?r='+Math.random();"/>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label"></label>
				<div class="layui-input-inline">
					<input type="text" name="verify_code" lay-verify="verify_code" autocomplete="off"
						   placeholder="短信验证码" class="layui-input">
				</div>
				<div class="f-r"><input class="but-border" onclick="sendSMS()" value="获取验证码"/></div>
			</div>
			<div class="layui-form-item submit-item">
				<div class="layui-input-block">
					<button class="layui-btn layui-btn-primary" lay-submit>取消</button>
					<button class="layui-btn btn-link-backgrund-orange btn-submit" lay-submit lay-filter="complate">提交</button>
				</div>
			</div>
		</form>
	</div>

{% endblock %}
{% block css_assets %}
	<style>
		.forget_pwd{
			position: absolute;
			right: -120px;
			top: 0;
			line-height: 38px;
			font-size:12px;

		}
		.forget_pwd:link,
		.forget_pwd:hover,
		.forget_pwd:active,
		.forget_pwd:visited
		{
			color:#0c91e5;
			text-decoration: none;
		}

		.forget_old_pwd{
			position: absolute;
			left: 250px;
			bottom: 137px;
			font-size: 12px;
		}
	</style>
	{% endblock %}

{% block js_assets %}
<script>
	$.ajax({
		url:'/myAccount/userinfo/base',
		type:'post',
		datatype:'json',
		success:function(data){
		    if(data.status == 200) {
		        if(data.datas) {
                    var result = JSON.parse(data.datas);
                    $("#name").html(result.full_name);
                    $("#identity_type").html(data.identity_type[result.identity_type]);
                    $("#identity_no").html(hideIdentityNo(result.identity_no, 6));
                    $("#mobile").html(hideIdentityNo(result.mobile));
                }
                return false;
            }
		}
	});


	layui.use(['form'],function(){
		var login_pw_form = layui.form;
		var pay_pw_form = layui.form;
		var next_form_sumbit = layui.form;

        login_pw_form.verify({
            login_old_pwd: function (value) {
                if (value.length == 0){
                    return '请输入密码';
                }
            },
            login_new_pwd:function(value){
                if(!passwordReg.test(value)){
                    return value.trim().length == 0 ? '请输入新密码' : passwordErrorMsg;
                }

                if(value == $('#login_old_pwd').val()){
                    $('#login_new_pwd').val('');
                    $('#login_new_pwd_re').val('');
                    return '新旧密码不得相同';
                }
			},
            login_new_pwd_re:function(value){
                if(value.length == 0){
                    return "请输入确认密码";
				}
                if(value != $('#login_new_pwd').val()){
                    $('#login_new_pwd_re').val('');
                    return '两次密码输入不一致';
                }
			}
        });

        pay_pw_form.verify({
            old_pwd: function (value) {
                if (value.length == 0){
                    return '请输入密码';
                }
            },
            new_pwd:function(value){
                if(!passwordReg.test(value)){
                    return value.trim().length == 0 ? '请输入新密码' : passwordErrorMsg;
                }

                if(value == $('#old_pwd').val()){
                    $('#new_pwd').val('');
                    $('#new_pwd_re').val('');
                    return '新旧密码不得相同';
                }
            },
           new_pwd_re:function(value){
                if(value.length == 0){
                    return "请输入确认密码";
                }
                if(value != $('#new_pwd').val()){
                    $('#new_pwd_re').val('');
                    return '两次密码输入不一致';
                }
            }
        });

		//修改登录密码
		login_pw_form.on('submit(submitLoginPw)',function(form_data){
				$.ajax({
					url:'/myAccount/update/login/passwd',
					data:form_data.field,
					type:'POST',
					datatype:'json',
					success:function(data){
					    if(data.status == 200){
					        $('input[name="password"]').val('');
                            layer.msg("登录密码修改成功！");
                            $('#login_old_pwd').val('');
                            $('#login_new_pwd').val('');
                            $('#login_new_pwd_re').val('');
						}else{
					        layer.msg(data.msg);
						}
						return false;
					}
				});
				return false;
		});

		//修改支付密码
        pay_pw_form.on('submit(submitPayPw)',function(form_data){
            $.ajax({
                url:'/myAccount/update/trade/passwd',
                data:form_data.field,
                type:'POST',
                datatype:'json',
                success:function(data){
                    if(data.status == 200){
                        layer.msg("支付密码修改成功！");
                        $('#old_pwd').val('');
                        $('#new_pwd').val('');
                        $('#new_pwd_re').val('');
                    }
                    return false;
                }
            });
            return false;

		});

        //找回交易密码 - 下一步提交
        next_form_sumbit.on('submit(next)',function(form_data){
            $.ajax({
				url:'/myAccount/trade/retrieve',
				data:form_data.field,
				type:'POST',
				datatype:'json',
				success:function(data){
				    if(data.status == 200){
				        $("#findOldPwd").hide();
				        $("#findOldPwd_step2").show();
				        return false;
					}
				}
			});
            return false;
		});
	});

    // to page 忘记原密码
    function toFindOldPwd(){
        layer.open({
            type: 1,
			area:['500px','350px'],
            content: $('#findOldPwd'), //这里content是一个普通的String
			function(){
                $("#findOldPwd").show();
			},
			end:function(){
                $("#findOldPwd").hide();
			}
        });
    }
    //发送验证码
    function sendSMS() {
        var mobile = $("#find_mobile").val();
        if(mobile.length == 0){
            layer.msg("请输入手机号", {icon: 2, time: 1000});
            return false;
		}
		if(mobile.length > 0){
            var reg = /^1[3|4|5|7|8][0-9]{9}$/;
            if (!reg.test(mobile)) {
                return '手机号码格式有误';
            }
        }

        $.ajax({
            url: "/common/send_sms",
            async: false,
            data: {mobile: mobile},
            type: "post",
            dataType: "json",
            contentType: "application/x-www-form-urlencoded;charset=utf-8",
            success: function (data) {
                if (data.status == 200) {
                    layer.msg("短信发送成功，请注意查收", {icon: 1, time: 1000,})
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
            }
        });
    }
</script>
{% endblock %}